var stompClient = null;

function setConnected(connected) {
    $("#connect").prop("disabled", connected);
    $("#disconnect").prop("disabled", !connected);
    if (connected) {
        $("#conversation").show();
    }
    else {
        $("#conversation").hide();
    }
    $("#greetings").html("");
}

function connect() {
    var socket = new SockJS('/bpo-raffle-websocket');
    stompClient = Stomp.over(socket);
    stompClient.connect({}, function (frame) {
        setConnected(true);
        console.log('Connected: ' + frame);
        stompClient.subscribe('/raffle/bingo', function (bingo) {
            showGreeting(JSON.parse(bingo.body).content);
        });
    });
}

function disconnect() {
    if (stompClient !== null) {
        stompClient.disconnect();
    }
    setConnected(false);
    console.log("Disconnected");
}

function sendName() {
    stompClient.send("/bpo/yaohao", {}, JSON.stringify({'name': $("#name").val()}));
}

function st() {
//	$.ajax({
//		type : "POST",
//		url : "/submit",
//		data : JSON.stringify({
//			"empCd" : "200307252",
//			"ticketCard" : "3"
//		}),
//		dataType : "json",
//		contentType : "application/json; charset=utf-8",
//		success : function(data) {
//			console.log(data);
//		},
//		error : function(data) {
//			console.log(data);
//		}
//	});
}

function showGreeting(message) {
    $("#greetings").append("<tr><td>" + message + "</td></tr>");
}

$(function () {
    $("form").on('submit', function (e) {
        e.preventDefault();
    });
    $( "#connect" ).click(function() { connect(); });
    $( "#disconnect" ).click(function() { disconnect(); });
    $( "#send" ).click(function() { sendName(); });
    $( "#st" ).click(function() { st(); });
});

